<script setup>
  import Button from '@/components/Button.vue'
  import { PROVIDE_KEY } from '../../consts.js'
  import { inject, toRaw } from 'vue'
  import { useSaleFileConfigStore } from '@/stores/saleFiles'

  const props = defineProps({
    file: Object,
    node: Object,
    requirement: Object,
  })
  let editable = true
  if (props.requirement) {
    if (
      props.requirement.validation &&
      props.requirement.validation_status == 'valid'
    ) {
      editable = false
    }
  }
  const config = useSaleFileConfigStore()
  const admin = config.getOptions('is_admin')
  const {
    onFileEdit,
    onFileAdd,
    onFileDelete,
    onFileDownload,
    onTemplate,
    onFileRequirementValidate,
  } = inject(PROVIDE_KEY)
</script>
<template>
  <td class="col_actions width_four">
    <template v-if="file && file.parent_id == node.id">
      <Button
        label="Modifier ce fichier"
        v-if="editable"
        @click="() => onFileEdit(node, file, requirement)"
        icon="pen"
      />
      <Button
        label="Télécharger ce fichier dans une nouvelle fenêtre"
        @click="() => onFileDownload(file)"
        icon="download"
      />
      <Button
        v-if="
          admin &&
          requirement &&
          requirement.validation &&
          requirement.validation_status != 'valid'
        "
        @click="() => onFileRequirementValidate(node, requirement)"
        label="Valider le fichier fourni ?"
        icon="check"
      />
      <Button
        label="Supprimer ce fichier"
        @click="() => onFileDelete(file, node, requirement)"
        icon="trash-alt"
        css="negative"
      />
    </template>
    <template v-if="!file">
      <Button
        label="Déposer un fichier"
        icon="plus"
        @click="() => onFileAdd(node, requirement)"
      />
    </template>
  </td>
</template>
